<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.yaodian100.core.common.utils.ServerValue"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ include file="/taglibs.jsp"%>

<head>
	<style type="text/css">
	h1 span{visibility:visible;}
	td span{visibility:visible;}
	.msg{float:left; line-height:1em; margin:0; display:block;border:1px solid #f66;padding:2px 5px;*padding:2px 5px 1px;}
	.msg.rn{background-color:#fff2f2;border-color:#f66;}
	
	.tb_clean {width: 100%;}
	.tb_clean td {border: 0px;}
	</style>
</head>

<c-rt:set var="midContextPath" value='<%=ServerValue.getMidContextPath() %>'/>
<c-rt:set var="frontHostname" value='<%=ServerValue.getFrontHostname() %>'/>
<s:url var="brandPops" value="/json/brandPops.do"/>
<s:url var="beandEdit" value="/brand/edit.do"/>
<s:url value="/images" var="imgPath"/>
<%-- Pops
<script src="/js/grid.locale-en.js" type="text/javascript"></script>
<script src="/js/jquery.jqGrid.min.js" type="text/javascript" charset="UTF-8"></script>
<link rel="stylesheet" type="text/css" media="screen" href="/css/ui.jqgrid.css" /> --%>
<%-- 数字验证 --%>
<script type="text/javascript" charset="UTF-8" src="${midContextPath}/js/jquery.alphanumeric.js"></script>
<!-- 月历 -->
<script type="text/javascript" charset="UTF-8" src="${midContextPath}/js/jquery.datepick.js"></script>
<script type="text/javascript" charset="UTF-8" src="${midContextPath}/js/jquery.datepick-zh-CN.js"></script>
<!-- 時間 -->	
<script type="text/javascript" src="${midContextPath}/js/jquery.timePicker.js"></script>
<link rel="stylesheet" type="text/css" href="${midContextPath}/js/timePicker.css"/>
<script type="text/javascript" charset="UTF-8" src="${midContextPath}/css/jquery-ui-1.7.2.custom.min.js"></script>
<link rel="stylesheet" type="text/css" href="${midContextPath}/css/smoothness.datepick.css" />
<script type="text/javascript" charset="UTF-8" src="${midContextPath}/js/yaodian100.common.js"></script>
<script type="text/javascript" charset="UTF-8" src="${midContextPath}/js/jquery.autotab-1.1b.js"></script>

<script>
$().ready(function() {
	$('#startDate').datepick({minDate: null, showOn: 'both', 
    	buttonImageOnly: true, buttonImage: '${imgPath}/calendar.gif',numberOfMonths:2,dateFormat:"yy-mm-dd",yearRange: '-50:+50'});
	$('#endDate').datepick({minDate:new Date(), showOn: 'both', 
    	buttonImageOnly: true, buttonImage: '${imgPath}/calendar.gif',numberOfMonths:2,beforeShow:customRange,dateFormat:"yy-mm-dd",yearRange: '-50:+50'});
	//$("#startTime").timePicker();
	//$("#endTime").timePicker();
	
	$('#sbtn').click(function() {
		cleanTip();
		if( validate_data() ) {
			$('#campaignForm').submit();
		}
	});
	
	<%--$('#getBrand').click(function() {
		doAR('${brandPops}', 'dialog');
		openDialog('品牌搜寻',content, 600, 440);
	});--%>
	
	$('#brandIdParam ').each(function() {
		$(this).blur(function(){
			$('#brandEdit').attr('href', '#');
			$('#brandImg').empty();
			$('#brandName').empty();
			var bid = this.value;
			if(bid!='') {
				$.post(
					'${midContextPath}/outlet/validateBrand.do',
					{'brandId': this.value},
					function(r) {
						cleanTip();
						if(r == null) {
							appendTip('brandIdParam', '品牌编号：' + bid + '不存在', false);
						} else {
							var brandId = r.brandId;
							var brandName = r.brandName;
							var img = $('<img>')
								.attr('src', '/static/brand/' + brandId + '/' + brandId + '.jpg')
								.bind('error', function() {
									this.src='/PImg/blank_75.gif';
								});
							$('#brandImg').append(img);
							$('#brandEdit').attr('href', '${beandEdit}?brandId=' + brandId);
							$('#brandEdit').attr('target', '_blank');
							$('#brandName').text(brandName);
						}
					},
					'json'
				);
			}
		});
	});
	
	$('#brandbtn').click(function() {
		$('#brandImg').empty();
		var brandId = $('#brandIdParam').val();
		if(brandId != '') {
			var img = $('<img>')
				.attr('src', '/static/brand/' + brandId + '/' + brandId + '.jpg')
				.bind('error', function() {
					this.src='/PImg/blank_75.gif';
				});
			$('#brandImg').append(img);
			$('#brandEdit').attr('href', '${beandEdit}?brandId=' + brandId);
			$('#brandEdit').attr('target', '_blank');
		} else {
			alert('请输入品牌编号ID');
		}
	});
	
	$('#brandCategoryId').each(function() {
		$('#' + this.id).onlyInteger();
		$(this).blur(function(){
			$('#categoryURL').empty();
			$('#categoryStatus').val('');
			if(this.value != '') {
				$.post(
					'${midContextPath}/outlet/createCategoryURL.do',
					$('form#campaignForm').serialize(),
					function(r) {
						cleanTip();
						$('#categoryURL').html( r.categoryURL );
						if( r.categoryStatus.length > 0 ) {
							appendTip('brandCategoryId', r.categoryStatus, false);
							$('#categoryStatus').val(r.categoryStatus);
						}
					},
					'json'
				);
			}
		});
	});
	
	$('button[id^=clean_]').click(function(event) {
		var type = this.id.replace('clean_', '');
		event.preventDefault();
		$('#' + type).val('');
		$('#' + type + 'Correct').val('');
	});
	
	$('img').error(function() {
		this.src='/PImg/blank_75.gif';
	});
	
	$('#mainAdWord, #insideAdWord').alphanumeric();
	$('#mainAdWord, #insideAdWord').autotab_filter({ format: 'custom', pattern: '[^a-zA-Z0-9]' });
	
	<%-- 验证图档正确 --%>
	$('#mainImg').change(function() {
		checkImg(this , 55, 600, 180, $('#mainImgCorrect'), '') ;
	});
	$('#insideImg').change(function() {
		checkImg(this , 90, 950, 285, $('#insideImgCorrect'), '') ;
	});
});

function validate_data() {
	var isCorrect = true;
	
	cleanTip();
		
	if( $('#brandCategoryId').val() == '' ) {
		appendTip('brandCategoryId', '请输入品牌商品分类编号', true);
		isCorrect = false;
	} else if( $('#categoryStatus').val() != '' ) {
		appendTip('brandCategoryId', $('#categoryStatus').val(), true);
		isCorrect = false;
	}
	
	if( $('#brandIdParam').val() == '' ) {
		appendTip('brandIdParam', '请输入品牌编号ID', true);
		isCorrect = false;
	}
	/*
	if( $('#insideImgLink').val() == '' ) {
		appendTip('insideImgLink', '请输入内页广告图片点击连结', true);
		isCorrect = false;
	}
	if( $('#mainImgLink').val() == '' ) {
		appendTip('mainImgLink', '请输入主页广告图片点击连结', true);
		isCorrect = false;
	}
	*/
	if( $('#insideImgCorrect').val() != '' ) {
		appendTip('leftImg', '请选择符合条件的内页广告图片', true);
		isCorrect = false;
	}
	if( $('#mainImgCorrect').val() != '' ) {
		appendTip('topImg', '请选择符合条件的主页广告图片', true);
		isCorrect = false;
	}
	if($('#outletId').val() == '') {
		if( $('#insideImg').val() == '' ) {
			appendTip('insideImg', '请输入上传内页广告图片', true);
			isCorrect = false;
		}
		if( $('#mainImg').val() == '' ) {
			appendTip('mainImg', '请输入上传主页广告图片', true);
			isCorrect = false;
		}
	}
	
	if($('#startDate').val()>$('#endDate').val()) {
		appendTip('endDate', '结束日期不能小于起始日期', true);
		isCorrect = false;
	} else if($('#startDate').val()==$('#endDate').val()) {
		if($('#startTime').val()>=$('#endTime').val()){
			appendTip('endDate', '结束时间需大于起始时间', true);
			isCorrect = false;
		}
	}
	/*if( $('#endTime').val() == '' ) {
		appendTip('endDate', '请输入结束时间 ', true);
		isCorrect = false;
	}
	if( $('#startTime').val() == '') {
		appendTip('startTime', '请输入起始时间', true);
		isCorrect = false;
	}*/
	if( $('#endDate').val() == '' ) {
		appendTip('endDate', '请输入结束日期', true);
		isCorrect = false;
	}
	if( $('#startDate').val() == '') {
		appendTip('startDate', '请输入起始日期', true);
		isCorrect = false;
	}
	
	if( $('#campaignName').val() == '' ) {
		appendTip('campaignName', '请输入活动名称', true);
		isCorrect = false;
	}
	
	if( isCorrect ) {
		if( $('#mainImg').val() != '' )
			$("#mainImgName").val($('#mainImg').val());
		if( $('#insideImg').val() != '' )
			$("#insideImgName").val($('#insideImg').val());
	}
	
	return isCorrect;
}

function customRange (){
	var startDt = $('#startDate').val(); //起始日
	var endDt = new Date(parseInt(startDt.substring(0,4),10),parseInt(startDt.substring(5,7),10)-1,parseInt(startDt.substring(8,10),10)); //結束日
	return {minDate:endDt}; 
}

<%-- 清空提示 --%>
function cleanTip() {
	$("span:[id^=Tip_]").hide();
	$("span:[id^=Tip_]").text('');
}
<%-- 附加提示 --%>
function appendTip(id, msg, isFocus) {
	if( !(isFocus == true || isFocus == false) ) 
		isFocus = true;
	
	var target = $('#Tip_' + id);
	if(target.text().length > 0) {
		appendWord(target, msg);
	} else
		target.text(msg);
	target.show();
	if(isFocus)
		$('#' + id).focus();
}

function appendWord(origin, apptext){
	if(origin.text().length==0){
		origin.text(apptext);
	}else{
		origin.text(origin.text()+', '+apptext);
	}
}
</script>

<s:if test="hasErrors()">
<p><s:actionerror cssClass="msg rn" /></p>
</s:if>
<s:if test="hasActionMessages()">
<p><s:actionmessage cssClass="msg rn" /></p>
</s:if>
<s:if test="hasFieldErrors()">
<p><s:fielderror cssClass="msg rn" /></p>
</s:if>

<h1>品牌折扣活动管理</h1>
<s:form action="save.do" namespace="/outlet" method="post" id="campaignForm" name="campaignForm" enctype="multipart/form-data" >
<s:hidden id="operation" name="operation" />
<s:hidden id="outletId" name="outlet.id" />
<table width="100%" class="tb-data">
	<tr>
		<th>类型</th>
		<td>奥特莱斯馆（品牌折扣）<s:hidden name="outlet.campaignType" /></td>
	</tr>
	<tr>
		<th><span class="txt-red">＊</span>活动名称</th>
		<td>
			<s:textfield id="campaignName" name="outlet.campaignName" size="50" />
			<br/><span id="Tip_campaignName" class="msg rn" style="display:none;"></span>
		</td>
	</tr>
	<tr>
		<th><span class="txt-red">＊</span>起迄期间</th>
		<td>
			<input name="startDate" id="startDate" size="18" value="<fmt:formatDate value="${outlet.startDate}" pattern="yyyy-MM-dd"/>" >
			<select id="startTime" name="startTime">			
				<c-rt:forEach begin="0" end="23" var="t1">
					<c-rt:if test="${t1<10}">
					<c-rt:set value="0${t1}:00" var="sTime"></c-rt:set>
					</c-rt:if>
					<c-rt:if test="${t1>=10}">
					<c-rt:set value="${t1}:00" var="sTime"></c-rt:set>
					</c-rt:if>
					<option value="${sTime}" <c-rt:if test="${sTime==startTime}">selected</c-rt:if>>${sTime}</option>
				</c-rt:forEach>
			</select> ~ 
			<input name="endDate" id="endDate" size="18" value="<fmt:formatDate value="${outlet.endDate}" pattern="yyyy-MM-dd"/>" >
			<select id="endTime" name="endTime">
			<c-rt:forEach begin="0" end="23" var="t2" >
				<c-rt:set var="t3">${23-t2}</c-rt:set>	
				<c-rt:if test="${t3<10}">
				<c-rt:set value="0${t3}:59" var="eTime"></c-rt:set>
				</c-rt:if>
				<c-rt:if test="${t3>=10}">
				<c-rt:set value="${t3}:59" var="eTime"></c-rt:set>
				</c-rt:if>
				<option value="${eTime}" <c-rt:if test="${eTime==endTime }">selected</c-rt:if>>${eTime}</option>
			</c-rt:forEach>
			<br/><span id="Tip_startDate" class="msg rn" style="display:none;"></span>
			<span id="Tip_endDate" class="msg rn" style="display:none;"></span>
		</td>
	</tr>
	<tr>
		<th><span class="txt-red">＊</span>主页广告</th>
		<td>
			<table width="100%" class="tb_clean">
				<tr>
					<td width="150px">图档</td>
					<td>
					<c-rt:if test="${not empty outletId}">
						<img src="${frontHostname }/eventImg/${outlet.mainImgFolder}/${outlet.campaignType}/${outlet.mainImgName}">
					</c-rt:if>
					</td>
				</tr>
				<tr>
					<td>上传图片</td>
					<td>
						<s:file id="mainImg" name="mainImg" value=""  size="36" />
						<s:hidden id="mainImgCorrect" ></s:hidden>
						<button id="clean_mainImg" type="button" >清除图档</button>
						<br/><span class="txt-rd">图片规格：600x180 &lt; 55KB</span>
						<br/><span id="Tip_mainImg" class="msg rn" style="display:none;"></span>
					</td>
					<s:hidden id="mainImgName" name="outlet.mainImgName" />
					<s:hidden id="mainImgFolder" name="outlet.mainImgFolder" />
				</tr>
				<%-- 
				<tr>
					<td>图片点击连结</td>
					<td>
						<s:textfield id="mainImgLink" name="outlet.mainImgLink" size="50" />
						<br/><span class="txt-rd">ex:http://www.yaodian100.com</span>
						<br/><span id="Tip_mainImgLink" class="msg rn" style="display:none;"></span>
					</td>
				</tr>
				--%>
				<tr>
					<td>广告代码</td>
					<td>
						<s:textfield id="mainAdWord" name="outlet.mainAdWord" size="50" />
						<br/><span class="txt-rd">非必填。由英数字组成，最多25个半角</span>
					</td>
				</tr>
			</table>
		</td>
	</tr>
	<tr>
		<th><span class="txt-red">＊</span>内页广告</th>
		<td>
			<table width="100%" class="tb_clean">
				<tr>
					<td width="150px">图档</td>
					<td>
					<c-rt:if test="${not empty outletId}">
						<img src="${frontHostname }/eventImg/${outlet.insideImgFolder}/${outlet.campaignType}/${outlet.insideImgName}">
					</c-rt:if>
					</td>
				</tr>
				<tr>
					<td>上传图片</td>
					<td>
						<s:file id="insideImg" name="insideImg" value=""  size="36" />
						<s:hidden id="insideImgCorrect" ></s:hidden>
						<button id="clean_insideImg" type="button" >清除图档</button>
						<br/><span class="txt-rd">图片规格：950x285 &lt; 90KB</span>
						<br/><span id="Tip_insideImg" class="msg rn" style="display:none;"></span>
					</td>
					<s:hidden id="insideImgName" name="outlet.insideImgName" />
					<s:hidden id="insideImgFolder" name="outlet.insideImgFolder" />
				</tr>
				<tr>
					<td>图片点击连结</td>
					<td>
						<s:textfield id="insideImgLink" name="outlet.insideImgLink" size="50" />
						<br/><span class="txt-rd">ex:http://www.yaodian100.com</span>
						<br/><span id="Tip_insideImgLink" class="msg rn" style="display:none;"></span>
					</td>
				</tr>
				<tr>
					<td>广告代码</td>
					<td>
						<s:textfield id="insideAdWord" name="outlet.insideAdWord" size="50" />
						<br/><span class="txt-rd">非必填。由英数字组成，最多25个半角</span>
					</td>
				</tr>
			</table>
		</td>
	</tr>
	<tr>
		<th><span class="txt-red">＊</span>品牌相关编号</th>
		<td>
			<table width="100%" class="tb_clean">
				<tr>
					<td width="150px">品牌编号ID</td>
					<td>
						<s:textfield id="brandIdParam" name="outlet.brandId" size="50" /><span id="brandName" style="margin-left: 10px;"><c-rt:if test="${not empty outletId}">${brand.brandName}</c-rt:if></span>
						<br/><span class="txt-rd">
						例如：品牌专页网址为http://www.yaodian100.com/ecmall/search/searchBrand.do?brandId=BD000229，品牌编号应为BD000229
						</span>
						<br/><span id="Tip_brandIdParam" class="msg rn" style="display:none;"></span>
					</td>
				</tr>
				<tr>
					<td>品牌LOGO图档</td>
					<td>
						<div id="brandImg" style="float: left;">
							<c-rt:if test="${not empty outletId}">
							<img src="${frontHostname }/static/brand/${outlet.brandId}/${outlet.brandId}.jpg">
							</c-rt:if>
						</div>
						<span class="txt-rd">
							<c-rt:if test="${not empty outletId}">
							<a id="brandEdit" href="${beandEdit}?brandId=${outlet.brandId}" target="_blank">
							</c-rt:if>
							<c-rt:if test="${empty outletId}">
							<a id="brandEdit" href="#" >
							</c-rt:if>
								这里的数据有问题吗？前往品牌管理
							</a>
						</span>
					</td>
				</tr>
				<tr>
					<td>品牌故事页</td>
					<td>
						http://www.yaodian100.com/ecmall/search/searchBrand.do?brandId=BD000229
					</td>
				</tr>
				<tr>
					<td>品牌商品分类编号</td>
					<td>
						<s:textfield id="brandCategoryId" name="outlet.brandCategoryId" size="20" />
						<input type="hidden" id="categoryStatus" />
						<span id="categoryURL"><c-rt:if test="${not empty outletId}">${categoryURL}</c-rt:if></span>
						<br/><span class="txt-rd">请指定折扣品牌活动之商品分类编号</a></span>
						<br/><span id="Tip_brandCategoryId" class="msg rn" style="display:none;"></span>
					</td>
				</tr>
			</table>
		</td>
	</tr>
	<tr>
		<th><span class="txt-red">＊</span>是否启用</th>
		<td>
			<s:radio list="#{'true':'是','false':'否'}" name="outlet.enable" listKey="key" listValue="value"></s:radio>
		</td>
	</tr>
	<tr>
		<th>&nbsp;&nbsp;&nbsp; 修改记录：</th>
		<td>
			<p>建立：<fmt:formatDate value="${outlet.createDate}" pattern="yyyy-MM-dd HH:mm"/> / ${outlet.createUser}</p>
			<p>修改：<fmt:formatDate value="${outlet.modifyDate}" pattern="yyyy-MM-dd HH:mm"/> / ${outlet.modifyUser}</p>
		</td>
	</tr>
</table>
</s:form>
<p class="f-link"><a id="sbtn" href="#">储存</a> <a href="search.do">回查询列表</a></p>